<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<title>尚合导航栏</title>
		<style>
			body {
				font-size: 12px;
				font-family: "宋体"，"微软雅黑";
			}
			.head {
				margin: auto;
				width: 980px;
				height: 40px;
				/*background-color: red;*/
			}
			
			.head_img {
				margin: 2px 2px;
				width: 200px;
				float: left;
				/*background-image: url(img/logo.jpg);*/
			}
			/*搜索框*/
			
			.head_search {
				margin: 5px 50px;
				float: right;
				/*border: 1px solid red;*/
			}
			
			.head_search_img {
				margin-top: 1px;
				float: right;
				width: 20px;
				height: 20px;
				background-image: url(img/search2.jpg);
				background-size: cover;
			}
			/*导航部分*/
			
			.nav {
				width: auto;
				height: 60px;
				margin-top: 2px;
				background-color: black;
				background-image: url(img/nav_bg.png);
				border-top: 1px solid gainsboro;
				border-bottom: 1px solid gainsboro;
				/*background-size: cover;*/
			}
			
			.head_center {
				text-align: center;
				width: 980px;
				margin: 2px 0 auto;
			}
			
			.nav_nav {
				list-style: none;
				margin-top: 5px;
				/*background: url(img/nav_bg-line.png);*/
			}
			
			.nav_1,
			.nav_2,
			.nav_3,
			.nav_4,
			.nav_5,
			.nav_6 {
				width: 120px;
				height: 40px;
				color: black;
				text-align: center;
				float: left;
				margin-top: auto;
				/*display: inline-block;*/
				/*background-image: url(img/nav_bg-line.png);*/
			}
			
			.nav_1:hover {
				color: darkgoldenrod;
			}
			
			.nav_2:hover {
				color: darkgoldenrod;
			}
			
			.nav_3:hover {
				color: darkgoldenrod;
			}
			
			.nav_4:hover {
				color: darkgoldenrod;
			}
			
			.nav_5:hover {
				color: darkgoldenrod;
			}
			
			.nav_6:hover {
				color: darkgoldenrod;
			}
			
			.main {
				text-align: center;
			}
			
			.ann_nav {
				width: auto;
				height: 30px;
				background-image: url(img/nav_bg.png);
				border-top: 1px solid gainsboro;
				border-bottom: 1px solid gainsboro;
			}
			
			.ann_nav_center {
				width: 980px;
				height: 20px;
				margin: 5px auto;
				font-size: 12px;
				/*border: 1px solid red;*/
			}
			
			.ann_left {
				width: 600px;
				height: 20px;
				float: left;
				text-align: left;
				/*border-left: 1px solid gainsboro;
				border-right: 1px solid gainsboro;*/
			}
			
			.ann_right {
				width: 376px;
				height: 20px;
				float: right;
				/*border-left: 1px solid gainsboro;
				border-right: 1px solid gainsboro;*/
			}
			
			.ann_right .ann_right_ico1,
			.ann_right_ico2,
			.ann_right_ico3,
			.ann_right_ico4 {
				float: right;
				width: 15px;
				height: 15px;
				margin: 2px 2px;
			}
			
			.ann_main {
				width: 980px;
				height: 250px;
				/*border: red solid;*/
				margin: auto;
			}
			
			.ann_foot {
				width: auto;
				height: 300px;
				background-color: darkslategray;
			}
			
			.ann_main .ann_main1{
				width: 300px;
				height: 230px;
				margin: 10px 10px 0 0 ;
				border: 1px solid gainsboro;
				float: left;
			}
			.ann_main2{
				width: 340px;
				height: 230px;
				margin: 10px 10px 0 0 ;
				border: 1px solid gainsboro;
				float: left;
			}
			.ann_main3{
				width: 300px;
				height: 230px;
				margin: 10px 0 0 0 ;
				border: 1px solid gainsboro;
				float: left;
			}
			.ann_title{
				
				margin-top: 13px;
				margin-left: 6px;
				color: red;
			}
			.ann_main1_left{
				float: left;
				margin-left: 20px;
				margin-top: 90px;
			}
			.ann_main1_img{
				float: left;
				margin-top: 30px;
				margin-left: 10px;
			}
			
			.ann_main1_right{
				float:right;
				
			}
			.newlist{
				margin: 10px 18px 0 0;
			}
			ul{
				list-style: none;
			}
			.newlist li{
				height: 27px;
				border-bottom: 1px dashed #DCDCDC;
				line-height: 27px;
			}
			.ann_foot_table dl{
				float: left;
				margin-top: 20px;
				margin-right: 60px;
			}
			.ann_job{
				height: 12px;
				border-left: 3px solid red;
				margin-top: 10px;
				margin-left:28px ;
				padding-left: 5px;
			}
			.ann_main3 p{
				margin-left: 28px;
				margin-top: 20px;
			}
			.ann_foot_table{
				width: 980px;
				margin: 0 auto;
			}
			.ann_foot_table dl{
				float: left;
				margin-top: 20px;
				margin-right: 60px;
			}
			.ann_foot_table dd{
				color: gainsboro;
			}
			.ann_foot_table dt{
				color: #707070;
				margin-top: 20px;
				margin-left: 40px;
			}
		</style>
	</head>

	<body>
		<!--头部-->
		<div class="head">
			<div class="head_img"><img src="img/logo.jpg" /></div>
			<div class="head_search">
				<input type="text" value="请输入..." />
				<div class="head_search_img">
					
				</div>
			</div>
		</div>
		<!--导航栏部分-->
		<div class="nav">
			<div class="head_center">
				<ul class="nav_nav">
					<li class="nav_1">首页1</li>
					<li class="nav_2">首页2</li>
					<li class="nav_3">首页3</li>
					<li class="nav_4">首页4</li>
					<li class="nav_5">首页5</li>
					<li class="nav_6">首页6</li>
				</ul>
			</div>
		</div>
		<div class="main">
			<img src="img/banner.jpg" />
		</div>
		<div class="ann_nav">
			<div class="ann_nav_center">
				<div class="ann_left">
					最新公告：尚合Aone智能手机入网证已获取工信部门审批下发。尚合官网
				</div>
				<div class="ann_right">
					<img class="ann_right_ico1" src="img/renren.png" />
					<img class="ann_right_ico2" src="img/21.gif" />
					<img class="ann_right_ico3" src="img/weibo.png" />
					<img class="ann_right_ico4" src="img/xinlang.png" />
				</div>
			</div>
		</div>
		<div class="ann_main">
			<div class="ann_main1">
				<div class="ann_title">
					<img src="img/o.jpg"/><span>新品发布</span>					
				</div>
				<div class="ann_main1_left">
					<img src="img/left.png" />
				</div>
				<div class="ann_main1_img">
					<img src="img/home_hot_01.png" />
				</div>
				<div class="ann_main1_left">
					<img src="img/right.png"/>
				</div>
				
			</div>
			<div class="ann_main2">
				<div class="ann_title">
					<img class="ann_imag1" src="img/o.jpg"/><span>新闻中心</span>
					
				</div>
				<ul class="newlist">
						<li class="ftcolor">致歉公告</li>
						<li>首批尚合Aonet已全部售馨!</li>
						<li>【媒体报导】国产高性价比 尚合Aonet四核手机评测</li>
						<li>我司产品已经通过了国家强制性产品3C认证</li>
						<li>尚合Aone智能手机入网证已经获工信部门审批下发.</li>
						<li>我司通过ISO9001:2008国际质量管理体系认证</li>
					</ul>
			</div>
			<div class="ann_main3">
				<div class="ann_title">
					<img class="ann_imag1" src="img/o.jpg"/><span>技术与支持</span>
				</div>
				<div class="ann_job">售后服务</div>
				<div class="ann_job">售后服务</div>
				<div class="ann_job">售后服务</div>
				<div class="ann_job">售后服务</div>
				<p>
					深圳宝来有限责任公司
					<br />
					热线电话：400-744-8888
				</p>
			</div>
		</div>
		<div class="ann_foot">
			<div class="ann_foot_table">
				<dl>
					<dd>返回首页</dd>
					<dt>返回首页</dt>
				</dl>
				<dl>
					<dd>返回首页</dd>
					<dt>返回首页</dt>
				</dl>
				<dl>
					<dd>返回首页</dd>
					<dt>返回首页</dt>
				</dl>
				<dl>
					<dd>返回首页</dd>
					<dt>返回首页</dt>
				</dl>
			</div>
		</div>
	</body>

</html>